<template>
    <div>
        <!-- 票据领用查询 -->
        <div class="container">
             <!-- 标题栏 -->
            <el-row>
                <el-col :span="24" class="ticket-title">票据领用明细</el-col>
            </el-row>
            <!-- 表单栏 -->
            <el-row class="form-container">
                <el-col :span="24">
                    <avue-form v-model="checkFrom.obj" :option="checkFrom.option" class="yz-form"></avue-form>
                    <button class="check-btn form-btn" @click="check"><img src="../../assets/imgs/operation_btn_icon_tijiao_default.png" alt="" class="btn-img">查询</button>
                </el-col>
            </el-row>
            <!-- 表格栏 -->
            <avue-crud :data="detailList.data" :option="detailList.option" :page="detailList.page"  @current-change="tickRow"></avue-crud >
        </div>
    </div>
</template>

<script>
import qs from "qs";
import FormData from "../../components/common/form";
import TableData from "../../components/common/tableData";
const DIC = {
  ticType: [],
  getUser:[]
};
export default {
  data: function() {
    return {
      checkFrom: {
        obj: {},
        option: {
          dicData:DIC,
          column: [
            {
              label: "时间",
              prop: "date",
              type: "datetimerange",
              span: 8
            },
            {
              label: "领用人",
              prop: "user",
              type:"select",
              dicData:"getUser",
              span: 5
            },
            {
              label: "票据类型",
              prop: "ticType",
              type: "select",
              dicData: "ticType",
              span: 5
            }
          ]
        }
      },
      detailList: {
        page: {
          pageSizes: [10],
          total: 20,
          currentPage: 1,
          pageSize: 10,
        },
        data: [],
        option: {
          showSummary:true,
          align:'center',
          menu: false,
          page:true,
          column: [
            {
              label: "批次号",
              prop: "batch_no"
            },
            {
              label: "起始号",
              prop: "begin_no"
            },
            {
              label: "结束号",
              prop: "end_no"
            },
            {
              label: "数量",
              prop: "counts",
            },
            {
              label: "已用",
              prop: "used"
            },
            {
              label: "剩余",
              prop: "last"
            },
            {
              label: "当前票号",
              prop: "id"
            },
            {
              label: "领用人",
              prop: "owner_user"
            },
            {
              label: "票据类型",
              prop: "type"
            },
            {
              label: "操作人",
              prop: "update_user"
            },
            {
              label: "操作时间",
              prop: "update_time"
            }
          ]
        }
      }
    };
  },
  methods: {
    getgetUser(){
      this.postRequest("/sys/user/listWithSpell").then(data=>{
        for(var item of data.data){
          DIC.getUser.push({
            label:item.name,
            value:item.id
          });
        }
      });
    },
    getTicType(){
      this.postRequest("/fin/bill/billtype").then(data=>{
        for(var item of data.data){
          DIC.ticType.push({
            label:item.value,
            value:item.key
          });
        }
      })
    },
    tickRow(val){
      this.detailList.page.currentPage=val;
      this.getDetailList();
    },
    check() {
      this
        .postRequest(
          "/fin/bill/store/list",{
            filterRules: JSON.stringify([
              { field: "fin_bill_owner_scope.create_time", op: "dge", value: this.dateToString(this.checkFrom.obj.date[0])+" "+this.checkFrom.obj.date[0].toString().slice(17,24) },
              { field: "fin_bill_owner_scope.create_time", op: "dle", value: this.dateToString(this.checkFrom.obj.date[1])+" "+this.checkFrom.obj.date[1].toString().slice(17,24) },
              { field: "fin_bill_owner_scope.owner_user", op: "eq", value: this.checkFrom.obj.user },
              { field: "fin_bill_owner_scope.type", op: "eq", value: this.checkFrom.obj.ticType },
            ]),
          }
        )
        .then(data => {
          this.detailList.data=data.data.list;
        });
    },
    getDetailList() {
      this
        .postRequest("/fin/bill/store/claim/list",{
          rows:10,
          page:this.detailList.page.currentPage
        })
        .then(data => {
          this.detailList.page.total=data.data.totalRow;
          this.detailList.data=data.data.list;
        });
    }
  },
  computed: {},
  components: { FormData, TableData },
  watch: {},
  mounted() {
    console.log("票务领用查询");
    this.getDetailList();
    this.$emit("sendActive", "1-3");
    this.getgetUser();
    this.getTicType();
  }
};
</script>
<style scoped src="../../assets/css/financeManage/ticketGetCheck.css">
</style>